<template>
  <div class>
    <el-dialog :title="title" :visible.sync="dialogFormVisible" width="800px" @close="close">
      <el-form ref="form" :model="form" label-width="120px">
        <el-form-item label="选择模式：" prop="name">
          <el-radio-group v-model="form.goodsModel">
            <div class="mar_b20">
              <el-radio label="1">模式一：同步总店商品</el-radio>
              <div class="yb_margin lh16" style="margin-left: 25px">子门店将和总门店的商品库存、价格保持统一，仅能操作商品上下架，无商品编辑和新增权限</div>
            </div>
            <div class="mar_b20">
              <el-radio label="2">模式二：普通商品权限</el-radio>
              <div class="yb_margin lh16" style="margin-left: 25px">子门店仅能修改商品库存和价格以及商品上下架，无商品编辑和新增权限</div>
            </div>
            <div class="mar_b20">
              <el-radio label="3">模式三：超级商品权限</el-radio>
              <div class="yb_margin lh16" style="margin-left: 25px">子门店可操作商品库存和价格、商品上下架，以及新增商品权限，请谨慎开放。</div>
            </div>
          </el-radio-group>
          <div class="color-red">
            <span class="wei">特别注意：</span>门店商品权限一旦选择后，请勿随意修改，以免造成门店商品数据错乱
          </div>
        </el-form-item>
      </el-form>
      <div slot="footer" class="dialog-footer">
        <el-button size="medium" @click="close">取 消</el-button>
        <el-button size="medium" type="primary" @click="save">确 定</el-button>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import { changeGoodsModel } from '@/api/shop';
export default {
  name: 'goodlistedit',
  created() {},
  data() {
    return {
      form: {
        storeId: '',
        goodsModel: '1'
      },
      data: {},
      title: '',
      dialogFormVisible: false
    };
  },
  components: {},
  methods: {
    showEdit(row) {
      if (!row) {
        this.title = '商品模式选择';
      } else {
        this.title = '商品模式选择';
        this.form.goodsModel = row.goodsModel;
      }
      this.dialogFormVisible = true;
    },
    setStoreId(storeId) {
      this.form.storeId = storeId;
    },
    close() {
      this.$refs['form'].resetFields();
      this.form = this.$options.data().form;
      this.dialogFormVisible = false;
    },
    goodsMdel() {
      this.$baseConfirm(
        '门店商品权限一旦选择后，请勿随意修改，以免造成门店商品数据错乱，请谨慎操作！',
        null,
        async () => {
          this.$baseMessage('请点击确定按钮', 'warning');
        },
        async () => {
          this.close();
        }
      );
    },
    save() {
      this.$refs['form'].validate(async (valid) => {
        if (valid) {
          const { msg } = await changeGoodsModel(this.form);
          this.$baseMessage(msg, 'success');
          this.$emit('fetchData');
          this.close();
        } else {
          return false;
        }
      });
    }
  }
};
</script>
